<template>
<!--  <main-image :src="'/example/gis_chart_example.png'" style="margin-top: 30px;" />-->
  <div id="container"></div>
</template>
<script>
import Vue from 'vue';
import BasicCard from "@/components/Basic/Card/BasicCard.vue";
import MainImage from "@/components/Basic/Image/MainImage.vue";

export default Vue.extend({
  components: { BasicCard, MainImage },
  mounted() {
    this.$nextTick(() => {
      var imageLayer = new AMap.ImageLayer({
        url: 'http://qiniu.yangpihu.net/h5/map-2.jpg',
        bounds: new AMap.Bounds(
          // [119.895168, 30.099757],
          // [119.921280, 30.082162]
          [119.892968, 30.099757],
          [119.933280, 30.082162]
        ),
        zooms: [8, 19]
      });
      var map = new AMap.Map('container', {
        showLabel: false, //不显示地图文字标记
        resizeEnable: true,
        expandZoomRange:true,
        center: [119.914549, 30.072324],
        zoom: 19,
        zooms:[8, 19],
        layers: [
          new AMap.TileLayer({
            visible:false,
          }),
          imageLayer
        ]
      });
    })
  }
})
</script>
<style lang="scss" scoped>
html,
body,
#container {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 800px;
}
</style>
